Ext.onReady(function(){
    Ext.define('json_data',{
        extend: 'Ext.data.Model',
        fields: [
             {name:'course_id',type:'string'},
             {name:'course_name',type:'string'},
             {name:'grade_id',type:'string'},
             {name:'grade_name',type:'string'},
             {name:'price',type:'string'},
             {name:'period',type:'string'},
             {name:'discount',type:'string'}
        ]
    });
    //创建数据源
    var store = Ext.create('Ext.data.Store', {
    	//pageSize:20,
        model: 'json_data',
        groupField: 'grade_name',
	    proxy: {
	        type: 'ajax',
	        url: '/customercontrol/queryCourseFee/',
	        actionMethods:'post',
	        reader: {
	            type: 'json',
	            root: 'rows',
	            totalProperty: 'totalCount'
	        }
	    },
	    autoLoad: true
    });
    //多选
    var selModel = Ext.create('Ext.selection.CheckboxModel');
    //分组表头
    var groupingFeature = Ext.create('Ext.grid.feature.Grouping',{
    	groupHeaderTpl: '{name}'
    });
    //创建Grid
    var grid = Ext.create('Ext.grid.Panel',{
        store: store,
        //height: 500,
        selModel:selModel,
        columnLines:true,
        features: [groupingFeature],
        columns: [
            //{text: "", width: 80, dataIndex: 'grade_id', sortable: false},
            {text: "年级", width: 80, dataIndex: 'grade_name', sortable: false},
            //{text: "", width: 100, dataIndex: 'course_id', sortable: false},
            {text: "课程", width: 120, dataIndex: 'course_name', sortable: false},
            {text: "价格", width: 80, dataIndex: 'price', sortable: false},
            {text: "课时", width: 80, dataIndex: 'period', sortable: false},
            {text: "折扣率", width: 80, dataIndex: 'discount', sortable: false}
        ],
        title: '课时资费设置',
        // disableSelection: false,
        layout : 'fit',
        //frame:true,
        loadMask:true,
        region: 'north',
        renderTo: 'course-fee-grid',
        viewConfig: {
            stripeRows: true
        },
        dockedItems : [{
        	dock:'top',
        	xtype:'toolbar',
        	items:[{
        		xtype:'button',
        		text:'添加',
        		iconCls:'search', 
        		handler:function(){
        			form.getForm().reset();
        			win.show();
        		}
        	},{
        		xtype:'button',
        		text:'修改',
        		iconCls:'edit', 
        		handler:function(){
        			form.getForm().reset();
        			var selected = grid.getSelectionModel().getSelection();
					form.loadRecord(selected[0]);
        			win.show();
        		}
        	},{
        		xtype:'button',
        		text:'删除',
        		iconCls:'delete', 
        		handler:function(){
        			var selected = grid.getSelectionModel().getSelection();
        			var ids = [];
        			Ext.each(selected, function (item) {
        				ids.push(item.data.id);
        			});
        			alert(selected[0].get('grade_id'));
        		}
        	}]
        }]
    });



   
   var courseComboBox= Ext.create('Ext.form.field.ComboBox', { 
	   id : 'course',
	   name:'course',
       fieldLabel: '课程', 
       emptyText: '请选择', 
       store: new Ext.data.Store({ 
           singleton : true, 
	   	    proxy: {
	   	        type: 'ajax',
	   	        url: '/customercontrol/queryCourse/',
	   	        actionMethods:'post',
	   	        reader: {
	   	            type: 'json'
	   	        }
	   	    },
           fields:['id', 'name'], 
           autoLoad:true 
       }), 
       loadingText:'正在加载数据，请稍侯……', 
       triggerAction:'all', 
       valueField:'id', 
       displayField:'name'
   });    
	var form = Ext.create('Ext.form.Panel', {
		width: 550,
		frame: false,
		bodyPadding: 5,
        fieldDefaults: {
            msgTarget: 'side'
        },
        layout: 'anchor',
        defaults: {
            anchor: '100%'
        },
		items : [{
            xtype: 'combobox',
            anchor: '100%',
    	    id : 'grade',
    	    name:'grade',
            allowBlank:false,
            fieldLabel: '年级', 
            emptyText: '请选择', 
            store: new Ext.data.Store({ 
                singleton : true, 
        	    proxy: {
        	        type: 'ajax',
        	        url: '/customercontrol/queryGrade/',
        	        actionMethods:'post',
        	        reader: {
        	            type: 'json'
        	        }
        	    },
                fields:['id', 'name'], 
                autoLoad:true 
            }), 
            loadingText:'正在加载数据，请稍侯……', 
            triggerAction:'all', 
            valueField:'id', 
            displayField:'name'
		},courseComboBox,
		{
            xtype: 'textfield',
            name:'price',
            fieldLabel: '价格'
		},{
            xtype: 'textfield',
            name:'period',
            fieldLabel: '课时'
		}]
		
		//,{
        //    xtype: 'textfield',
        //    name:'discount',
        //    fieldLabel: '折扣',
		//	labelWidth: 50,
		//	width: 100
		//}]
	});

	var win = Ext.create('Ext.window.Window', {
		//title : '---',
		modal: true,
		closeAction: 'hide',
		items : [form],
		plain : true,
		resizable : false,
		buttonAlign : 'center',
		buttons : [ {
			text : '保存',
			handler : function() {
				if (form.getForm().isValid()) {
					form.getForm().submit({
						waitTitle : '请稍候',
						waitMsg : '正在处理......',
						url : '/customercontrol/saveCourseFee/',
						success : function(form, action) {
							Ext.Msg.alert('系统提示', action.result.message);
						},
						failure : function(form, action) {
							if (action.result) {
								Ext.Msg.alert('系统提示', action.result.text);
							} else {
								form.getForm().reset();
							}
						}
					});
				}
			}
		}, {
			text : '取消',
			handler : function() {
				form.getForm().reset();
				win.hide();
			}
		} ]
	});    
    
});